<script lang="ts" setup>
/*
  学习目标：掌握ref获取dom元素的ts写法
*/

import { nextTick, ref } from 'vue';

// 1. 创建ref
const iptRef = ref<HTMLInputElement | null>(null)
const isShow = ref(true)


const fn = () => {
  isShow.value = !isShow.value
  nextTick(() => {
    console.log('  ----->  ', iptRef.value);
  })
}
</script>

<template>
  <div>
    <!-- 2. 绑定ref属性 -->
    <input v-if="isShow" type="text" ref="iptRef">
    <button @click="fn">点我激活input</button>

  </div>
</template>

<style lang="scss" scoped>

</style>